import Vue from 'vue';
import _MessageBoxClass from './messageBox/messageBox.vue';
export class MessageBoxClass {
  messageBoxClass = null;
  #visiable ;
  constructor() {
    this.#visiable = false;
  }
  get visiable() {
    return this.#visiable
  }
  set visiable(value) {
    this.#visiable = value;
  }
  init() {
    let self = this;
    let messageBoxClass = Vue.extend(_MessageBoxClass);
    this.messageBoxClass = new messageBoxClass(
      {
        data(){
          return {
            visiable: self.visiable,
            initialData: {
              type: 'success',
              title: 'this is title-success',
              content: 'this is content-success'
            }
          }
        },
        methods: {
          hideMessageBox() {
            this.visiable = false;
          }
        }
      }
    ).$mount(document.createElement('div'));
    document.getElementById('homeView').appendChild(this.messageBoxClass.$el);
  }

  showInfo() {
    this.messageBoxClass.visiable = true;
    this.messageBoxClass.initialData = {
      type: 'info',
      title: 'this is title-info',
      content: 'this is content-info'
    }
  }
  showSuccess() {
    this.messageBoxClass.visiable = true;
    this.messageBoxClass.initialData = {
      type: 'success',
      title: 'this is title-success',
      content: 'this is content-success'
    }
  }
  showWarn() {
    this.messageBoxClass.visiable = true;
    this.messageBoxClass.initialData = {
      type: 'warn',
      title: 'this is title-warn',
      content: 'this is content-warn'
    }
  }
  showDanger() {
    this.messageBoxClass.visiable = true;
    this.messageBoxClass.initialData = {
      type: 'danger',
      title: 'this is title-danger',
      content: 'this is content-danger'
    }
  }
}